<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
    <title>dashboard</title>
    <%--引入jquery和bootstrap方式--%>
    <link rel="stylesheet" href="/webjars/bootstrap/4.6.1/css/bootstrap.min.css"/>
    <link rel="stylesheet" href="/css/layout.css"/>
    <script src="/webjars/jquery/3.5.1/jquery.min.js"></script>
    <script src="/webjars/bootstrap/4.6.1/js/bootstrap.min.js"></script>
    <style>
    </style>
</head>
<body>
<div class="head-body-container">
    <div class="head">
        <jsp:include page="component/header.jsp"></jsp:include>
    </div>
    <div class="aside-main-container">
        <div class="aside">
            <jsp:include page="component/asider.jsp"></jsp:include>
        </div>
        <div class="main">
            <form id="searchForm" class="form-inline" action="/dashboard" method="post">
                <input class="form-control" name="filename" placeholder="输入文件名"
                       value="${empty param.filename ? '':param.filename}"/>
                <input id="pageNum" type="hidden" name="pageNum"
                       value="${empty param.pageNum ? 1 :param.pageNum}"/>
                <input id="pageSize" type="hidden" name="pageSize"
                       value="${empty param.pageSize ? 5 :param.pageSize}"/>
                <button class="btn-primary btn" onclick="queryByCondition(1)">查询</button>
            </form>
            <table class="table table-striped">
                <thead class="table-dark">
                <tr>
                    <th>编号</th>
                    <th>下载时间</th>
                    <th>用户</th>
                    <th>文件名</th>
                    <th>下载状态</th>
                </tr>
                </thead>
                <tbody class="table-body-dldl">
                <c:forEach items="${results}" var="result">
                    <tr>
                        <td>${result.downloadLogId}</td>
                        <td>${result.downloadTime}</td>
                        <td>${result.username}</td>
                        <td>${result.filename}</td>
                        <td>${result.state}</td>
                    </tr>
                </c:forEach>
                </tbody>
            </table>

            <div class="btn-group-sm d-flex justify-content-center">
                <div>共${total}条</div>

                <c:forEach var="i" begin="1" end="${pages}" step="1">
                    <c:choose>
                        <c:when test="${i == param.pageNum}">
                            <button type="button" onclick="queryByCondition('${i}')"
                                    class="btn btn-secondary active">${i}</button>
                        </c:when>
                        <c:otherwise>
                            <button type="button" onclick="queryByCondition('${i}')"
                                    class="btn btn-secondary">${i}</button>
                        </c:otherwise>
                    </c:choose>
                </c:forEach>
            </div>

        </div>
    </div>
</div>
<script>
    function queryByCondition(pageNum) {
        // alert(pageNum);
        document.getElementById("pageNum").value = pageNum;

        document.getElementById("searchForm").submit();
    }
</script>
</body>
</html>